<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="1.css">
</head>

<body>
    <div id="box">
        <h1>kky后台管理系统</h1>
        <div class="entry">
            <div>
                姓名:<input type="text" id="user" value="aa" /> 年龄:
                <input type="number" id="age" value="18" />
            </div>
            <div id="sex">
                性别:<label>
                    男<input type="radio" name="sex" value="0" checked />
                </label>
                <label>
                    女<input type="radio" name="sex" value="1" />
                </label>
            </div>
            <div>
                <div id="hobby">
                    爱好:
                    <label>
                        电影<input type="checkbox" value="h1" />
                    </label>
                    <label>
                        唱歌<input type="checkbox" value="h2" />
                    </label>
                    <label>
                        游泳<input type="checkbox" value="h3" />
                    </label>
                    <label>
                        学习<input type="checkbox" value="h4" />
                    </label>
                    <label>
                        健身<input type="checkbox" value="h5" />
                    </label>
                </div>
                <div>
                    <label>
                        全选/全不选<input type="checkbox" id="checkAll" />
                    </label>
                    <button type="button" id="notCheck">反选</button>
                </div>
                <div>
                    教育程度
                    <select id="edu">
                        <option value="e1">小学</option>
                        <option value="e2">中学</option>
                        <option value="e3">高中</option>
                        <option value="e4">大学</option>
                        <option value="e5">硕士</option>
                    </select>
                </div>
                <div>
                    <button type="button" id="add">添加</button>
                    <button type="button" id="updf">确认修改</button>
                    <br />
                    <button type="button" id="oddColor">开启隔行变色</button>
                    <button type="button" id="enterColor">开启移入变色</button>
                    <br />
                    <button type="button" id="ageSort">按年龄升序</button>
                    <br />
                    <button type="button" id="clearAll">全部清除</button>
                </div>
                <div>
                    查找姓名:<input type="text" id="search" placeholder="仅能按姓名搜索" />
                    <button type="button" id="searchBtn">搜索</button>
                </div>
                <div id="pro"></div>
            </div>
        </div>
        <table class="show" id="show">
            <thead id="trth">
                <tr>
                    <th>姓名</th>
                    <th>年龄</th>
                    <th>性别</th>
                    <th>爱好</th>
                    <th>教育程度</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="tab"></tbody>
        </table>
    </div>
    <script src="1.js"></script>
</body>

</html>